<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>五指山污水处理系统</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/huazhi/lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="<%=request.getContextPath()%>/huazhi/css/public.css" media="all">
    <link rel="shortcut icon" href="<%=request.getContextPath()%>/huazhi/images/favicon.ico"/>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-xs15">
            <div class="layui-card">
                <div class="layui-card-body">
                    <blockquote class="layui-elem-quote">
                        <div class="layui-inline">
<%--                            <div class="layui-input-inline">--%>
<%--                                <input class="layui-input searchval" type="text" placeholder="请输入搜索的内容">--%>
<%--                            </div>--%>
                            <div class="layui-input-inline">
                                <input name="starttime" class="layui-input" id="Sdate"
                                       placeholder="请选择起始时间" readonly="readonly">
                            </div>
                            <div class="layui-input-inline">
                                <input name="endtime" class="layui-input" id="Edate"
                                       placeholder="请选择结束时间" readonly="readonly">
                            </div>
                            <div class="layui-input-inline">
                                <select name="category" class="layui-input" id="category">
                                    <option value="">请选择汇总类型</option>
                                    <option value="number">DTU编号</option>
                                    <option value="type">异常类型</option>
                                    <option value="reason">异常原因</option>
                                    <option value="all">具体异常</option>
                                </select>
                            </div>
                            <button class="layui-btn" id="search_btn" data-type="reload">汇总</button>
                        </div>
                    </blockquote>
                    <table class="layui-hide" id="alertTable" lay-filter="alertTables"></table>
<%--                    <div id="makeuser" style="padding-top: 5px;display: none;"> <div style="text-align: right" > 制表人：${user.name}<input type="text"  style="visibility:hidden;width:20px;"> 制表时间：${datetime}&nbsp;</div></div>--%>
                    <div id="laypage"></div>
                    <input type="hidden" id="selectdata">
                    <input type="hidden" id="type">
                    <input type="hidden" id="exportdata">
                </div>
            </div>
        </div>
    </div>
</div>
<input type="hidden" id="curnum" value="1">
<script type="text/html" id="alertOperation">
</script>
<script type="text/html" id="table-alert">
</script>
<script src="<%=request.getContextPath()%>/huazhi/lib/layui-v2.5.5/layui.all.js"></script>
<script src="<%=request.getContextPath()%>/huazhi/js/lay-config.js?v=1.0.4" charset="utf-8"></script>
<script>
    layui.use(['table', 'alertclassify', 'layer', 'form', 'laydate', 'laypage'], function () {
        var $ = layui.jquery,
            table = layui.table,
            layer = layui.layer,
            laydate = layui.laydate,
            laypage = layui.laypage,
            form = layui.form;

        laydate.render({
            elem:'#Sdate',
            type:'date'
        });
        laydate.render({
            elem:'#Edate',
            type:'date'
        });
        // var resultdata = null;
        var data = null;
        var title = "";
        //搜索事件
        var active = {
            reload: function () {  //data-type='reload'
                $("#curnum").val("1");
                var category = $("#category").val();
                switch (category) {
                    case "":
                        data = [{title: 'ID', width: 70, sort: true, fixed: 'left', type: 'numbers'},
                            {field: 'number', title: '编号', sort: true},
                            {field: 'type', title: '异常类型', sort: true},
                            {field: 'reason', title: '异常原因', sort: true},
                            {field: 'timestring', title: '发生时间', sort: true},
                            {field: 'jingdu', title: '所在经度', sort: true},
                            {field: 'weidu', title: '所在纬度', sort: true},
                            {field: 'd.state', title: '状态', sort: true,templet: '<div>{{d.state == "0"?"未处理":"已处理"}}</div>'}];
                        title = "异常信息表";
                        break;
                    case "all":
                        data = [{title: 'ID', width: 70, sort: true, fixed: 'left', type: 'numbers'},
                            {field: 'number', title: 'DTU编号', sort: true},
                            {field: 'type', title: '异常类型', sort: true},
                            {field: 'reason', title: '异常原因', sort: true},
                            {field: 'sum', title: '异常数量', sort: true}];
                        title = "异常汇总表";
                        break;
                    case "number":
                        data = [{title: 'ID', width: 70, sort: true, fixed: 'left', type: 'numbers'},
                            {field: 'number', title: 'DTU编号', sort: true},
                            {field: 'sum', title: '异常数量', sort: true}];
                        title = "异常DTU编号汇总表";
                        break;
                    case "type":
                        data = [{title: 'ID', width: 70, sort: true, fixed: 'left', type: 'numbers'},
                        {field: 'type', title: '异常类型', sort: true},
                        {field: 'sum', title: '异常数量', sort: true}];
                        title = "异常类型汇总表";
                        break;
                    case "reason":
                        data = [{title: 'ID', width: 70, sort: true, fixed: 'left', type: 'numbers'},
                            {field: 'reason', title: '异常原因', sort: true},
                            {field: 'sum', title: '异常数量', sort: true}];
                        title = "异常原因汇总表";
                        break;
                    default:break;
                }
                tablereload(data,title,category);
            }
        };
        $('#search_btn').on('click', function () { //搜索的id
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
        table.on('toolbar(alertTables)', function (obj) {
        <%--    var checkStatus = table.checkStatus(obj.config.id),--%>
        <%--        checkdata = checkStatus.data; //获取选中的数据--%>
        <%--    var jsonstring = null;--%>
        <%--    if(checkdata.length > 0){--%>
        <%--        jsonstring = JSON.stringify(checkdata);--%>
        <%--    }--%>
        <%--    var ids = [];--%>
        <%--    var xqo = eval('(' + jsonstring + ')');--%>
        <%--    for(var i in xqo){--%>
        <%--        ids[i] = xqo[i].tid;--%>
        <%--    }--%>
            switch (obj.event) {
        <%--        case 'statistics':--%>
        <%--            var data1=[--%>
        <%--                {title: 'ID', width: 70, sort: true, fixed: 'left', type: 'numbers'},--%>
        <%--                {field: 'sum', title: '志愿者人数', sort: true},--%>
        <%--                {field: 'sumoftask', title: '共发布任务数', sort: true},--%>
        <%--                {field: 'sumoffinished', title: '共完成任务数', sort: true},--%>
        <%--                {field: 'sumofman', title: '平均每任务志愿者人数', sort: true},--%>
        <%--                {field: 'sumofhour', title: '志愿者共工作小时', sort: true},--%>
        <%--                {field: 'sumofaverage', title: '志愿者平均工作小时', sort: true}];--%>
        <%--            url = 'volunteer/getVolunteerWork';--%>
        <%--            title = "志愿者工作统计";--%>
        <%--            tablereload(defaultToolbar,url,title,data1,ids);--%>
        <%--            type.val("志愿者工作统计");--%>
        <%--            makeuser.style.display = "";--%>
        <%--            break;--%>
        <%--        case 'dynamic_query':--%>
        <%--            var data2=[--%>
        <%--                {title: 'ID', width: 70, sort: true, fixed: 'left', type: 'numbers'},--%>
        <%--                {field: 'recruitNum', title: '招募志愿者人数', sort: true},--%>
        <%--                {field: 'registerNum', title: '登记志愿者人数', sort: true},--%>
        <%--                {field: 'checkedNum', title: '审核志愿者人数', sort: true},--%>
        <%--                {field: 'delNum', title: '流失志愿者人数', sort: true}];--%>
        <%--            url = 'volunteer/getVolunteerWorkSearch';--%>
        <%--            title = "志愿者人员统计";--%>
        <%--            tablereload(defaultToolbar,url,title,data2,null);--%>
        <%--            type.val("志愿者人员统计");--%>
        <%--            makeuser.style.display = "";--%>
        <%--            break;--%>
                case 'exportdatas':
                    var endtime = $("#Edate").val();
                    var starttime = $("#Sdate").val();
                    var category = $("#category").val();
                    var url="<%=request.getContextPath()%>/rest/base/ExportClassifyExcel?type=" + title + "&category=" + category + "&endtime=" + endtime + "&starttime=" + starttime;
                    window.open(url);
                    break;
            }
        });
        function tablereload(data,title,category) {
            var endtime = $("#Edate").val();
            var starttime = $("#Sdate").val();
            var limitcount = 10;
            $("#curnum").val("1");
            table.render({ //表格的id
                elem:"#alertTable",
                url: "<%=request.getContextPath()%>/rest/base/getAlertListByClassify",
                title: title,
                height: 'full-193',
                page: false,
                limit: limitcount,
                toolbar: '#alertOperation',
                defaultToolbar : ['filter',{
                    title: '导出' //标题
                    ,layEvent: 'exportdatas' //事件名，用于 toolbar 事件中使用
                    ,icon: 'layui-icon-export' //图标类名
                },'print'],
                cols: [data],
                where:{
                    category:category,
                    endtime:endtime,
                    starttime:starttime,
                },
                text: {
                    none: '暂无相关数据' //默认：无数据。注：该属性为 layui 2.2.5 开始新增
                },
                done: function (res, curr, count) {
                    if(res.errorMsg==null){
                        //$("#exportdata").val(JSON.stringify(res.data[0]));
                        // resultdata = res.data[0];
                    }else {
                        layer.msg(res.errorMsg);
                    }
                    $('.layui-table-fixed-r').removeClass('layui-hide');//列固定右侧
                    var curnum = $("#curnum").val();
                    laypage.render({
                        elem: 'laypage'
                        , first: '首页'
                        , last: '尾页'
                        , groups: 5
                        , count: count
                        , curr: curnum
                        , limit: limitcount
                        , layout: ['prev', 'page', 'next', 'skip', 'count', 'limit']
                        , limits: [10, 15, 20]
                        , jump: function (obj, first) {
                            if (!first) {
                                curnum = obj.curr;
                                $("#curnum").val(curnum);
                                limitcount = obj.limit;
                                table.reload('alertTable', { //表格的id
                                    where: {
                                        page: curnum,
                                        limit: limitcount
                                    }
                                })
                            }
                        }
                    });
                }
            });
        }
    });
</script>
</body>
</html>
